<!DOCTYPE html>
<html>
<head>
    <title>保险产品系列</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/js/plugins/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <script src="/js/plugins/jquery/jquery.min.js"></script>
    <script src="/js/plugins/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/strategyCatalogs.css"/>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <script src="/js/common.js"></script>
    <script>
        $(function () {

            // 获取请求参数
            var params = getParams();

            // 判断是否传递有选定产品id
            if (params.id) {
                // 获取保险产品对象
                $.get('/insurances/products/' + params.id, function (data) {
                    console.log(data);
                    $(".selectedProduct").renderValues(data, {
                        getHref: getHref
                    });
                });
            }
            /*------------------------------------------------------------------------*/
            // 从sessionStorage中获取用户信息
            var user = JSON.parse(sessionStorage.getItem('user'));

            /*-----------------------------------------*/
            // 点击购买按钮，跳转购买页面
            $("#purchaseBtn").click(function () {
                if (user) {
                    // 已登录，直接跳转订单界面
                    window.location.href = "/mine/insuranceOrderFill.html?id=" + params.id;
                } else {
                    // 未登录，跳转登录界面
                    window.location.href = "login.html";
                }

            });
            /*-----------------------------------------*/
            // 点击放入购物车按钮，跳转购物车页面
            $("#saveBtn").click(function () {

                if (user) {
                    // 已登录，直接跳购物车界面
                    window.location.href = "/mine/fillHouse.html?id=" + params.id;
                } else {
                    // 未登录，跳转登录界面
                    window.location.href = "login.html";
                }

            });
            /*------------------------------------------------------------------------*/
        });
    </script>
</head>

<body>
<!--全局搜索隐藏-->
<div class="search-head">
    <div class="row nav-search">
        <div class="col-2">
            <a href="javascript:history.go(-1);">
                <span><i class="fa fa-chevron-left fa-2x"></i></span>
            </a>
        </div>
        <!-- <div class="col-10">
             <div class="input-group-sm search">
                 <input class="form-control searchBtn" placeholder="搜索">
             </div>
         </div>-->
    </div>
</div>

<hr>
<div class="selectedProduct">

    <!--顶部封面图 待加载数据-->
    <div class="banner-wrapper">
        <div class="banner-wrapper1">
            <div class="focus focus-h">
                <div class="slider slider-h">
                    <img class="cover" render-src="coverUrl" width="100%">
                </div>

                <div class="banner-t-font" style="font-size: 15px">

                    <div class="shadow_insure">
                        <i>
                            <b render-html="productName" style="font-size: small;color:purple"></b>
                        </i>
                        <em>
                            <b>
                                <u render-html="insurance.name" style="font-size: smaller;color: #0c5460"></u>&nbsp;&nbsp;&nbsp;
                            </b>
                            <b style="font-size: smaller">
                                ¥<u render-html="price" style="font-size: smaller">80</u>
                            </b>&nbsp;&nbsp;&nbsp;

                        </em>

                    </div>

                </div>
            </div>
        </div>
    </div>


    <hr>
    <!--标题条展示-->
    <ul class="nav nav-pills nav-justified border border-left-0 border-top-0 border-right-0" id="pills-tab">
        <li class="nav-item ">
            <a class="nav-link active" id="pills-catalog-tab" data-toggle="pill" href="#pills-catalog">
                <span>重要须知</span>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link " id="pills-comment-tab" data-toggle="pill" href="#pills-comment">
                <span>常见问题</span>
            </a>
        </li>
    </ul>

    <!--重要问题存放-->
    <div class="tab-content " id="pills-tabContent">
        <!--重要须知-->
        <div class="tab-pane fade show active" id="pills-catalog">
            <div class="container hot">
                <div class="content" render-html="insuranceContent.content" style="font-size: smaller">重要须知</div>
            </div>
        </div>

        <!--常见问题-->
        <div class="tab-pane fade " id="pills-comment">
            <div class="container">
                <div class="content" render-html="insuranceContent.faq" style="font-size: smaller">常见问题</div>
            </div>
        </div>
    </div>
</div>
<div class="protect-footer" style="font-size: small;color: red">生效前可无理由退保</div>

<div class="operation" style="align-content: center">
    <!--<button class="btn" id="saveBtn"></button>-->
    <button class="btn btn-danger" id="purchaseBtn" style="align-content: center">立即购买</button>
</div>
<hr>

<!--
<style>
    .btn {
        position: fixed;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
</style>-->



</body>
</html>